<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
	<title>Marvin JS Example - Load Custom Templates</title>
	<link type="text/css" rel="stylesheet" href="../css/doc.css" />
	<link type="text/css" rel="stylesheet" href="../js/lib/rainbow/github.css" />
	<script src="../js/lib/jquery-1.9.1.min.js"></script>
	<script src="../js/lib/rainbow/rainbow-custom.min.js"></script>
</head>
<body>
	<h1>Marvin JS Example - Load Custom Templates</h1>
	<div style="clear: both; width: 100%; text-align: right;"><a href="index.html">Back to index</a></div>
	<div class="resizable">
		<iframe src="../editorws.html" id="sketch" class="sketcher-frame" data-templateurl="templates/mytemplates.mrv"></iframe>
	</div>
	<div>
	<p>In this example, custom templates are loaded. These templates are stored in <em>templates/mytemplates.mrv</em> (URL is relative to the directory of Marvin JS package).
	It is an MRV file that contains several molecule structures.
	They will appear on custom templates toolbar if location of their source file is defined in the <strong>data-templateurl</strong> attribute of the <code>iframe</code> tag of the editor.</p>
	<pre><code data-language="html">&lt;div class=&quot;resizable&quot;&gt;
	&lt;iframe src=&quot;../editorws.html&quot; id=&quot;sketch&quot; class=&quot;sketcher-frame&quot; data-templateurl=&quot;templates/mytemplates.mrv&quot;&gt;&lt;/iframe&gt;
&lt;/div&gt;</code>
		</pre>
	</div>
	<div style="clear: both; width: 100%; text-align: right;"><a href="index.html">Back to index</a></div>
</body>
</html>
